<template>
  <div>
    <el-dialog
      :title="'[' + title + ']所有子话题修改|id:' + parent_id"
      :visible.sync="dialogVisible"
      :close-on-click-modal="false"
      class="mt-dialog"
      @close="close"
    >
      <el-divider content-position="center">筛选条件</el-divider>
      <el-row>
        <el-col :span="12">
          <span style="margin-right: 20px">进度:</span><el-slider
            v-model="filter_progress"
            style="display: inline-block; width: 200px"
            range
            :marks="progress_marks"
            :max="100"
            @change="handleModify('count')"
          />
        </el-col>
        <el-col :span="12">
          <span style="margin-right: 20px">评分:</span>
          <el-slider
            v-model="filter_stars"
            style="display: inline-block; width: 200px"
            range
            show-input
            :min="1"
            :max="5"
            @change="handleModify('count')"
          />
        </el-col>
      </el-row>
      <el-alert
        :title="filter_content"
        type="warning"
      />
      <el-divider content-position="center">每一个参数单独修改</el-divider>
      <el-form ref="dataForm" :model="topicTemp" label-position="left" label-width="100px">
        <el-form-item label="优先级">
          <el-rate
            v-model="topicTemp.star"
            style="display: inline-block"
            :texts="['最低', '很低', '一般', '很高', '最高']"
            show-text
          />
          <el-button type="danger" size="mini" @click="handleModify('star')">提交修改</el-button>
        </el-form-item>
        <el-form-item label="AI控制">
          <el-row :gutter="2">
            <el-col :span="4">
              段落:
              <el-input v-model="topicTemp.ai_paragraph" style="width: 70%" title="输入段落数量" size="mini" placeholder="段落数量" />
            </el-col>
            <el-col :span="12">
              AI:
              <el-select v-model="topicTemp.ai_writer" placeholder="AI类型" size="mini" class="head" clearable>
                <el-option
                  v-for="item in ai_writers"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </el-col>
          </el-row>
          <el-button type="danger" size="mini" @click="handleModify('ai')">批量修改</el-button>
        </el-form-item>
        <el-form-item label="推广/tag:">
          <span><el-input v-model="topicTemp.tag" size="mini" style="width: 200px" /></span>
          <el-button type="success" size="mini" @click="handleModify('tag')">提交</el-button>
        </el-form-item>
        <el-form-item label="progress">
          <el-slider
            v-model="topicTemp.progress"
            style="width: 200px;display: inline-block; margin: auto;"
            :max="100"
          />
          <el-button type="danger" size="mini" @click="handleModify('progress')">提交</el-button>
        </el-form-item>
        <el-form-item label="SERP">
          <el-switch
            v-model="topicTemp.serp_crawl"
            active-color="#13ce66"
            inactive-color="#ff4949"
          />
          <el-button type="danger" size="mini" @click="handleModify('serp')">提交</el-button>
        </el-form-item>
        <el-form-item label="删除所有文章">
          <el-button type="danger" size="mini" @click="handleModify('delete_post')">提交</el-button>
        </el-form-item>
        <el-form-item label="删除所有">
          <el-button type="danger" size="mini" @click="handleModify('delete')">提交</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
  </div>
</template>

<script>
import { topic_childrens_modify } from '@/api/cms/topic'
export default {
  name: 'ChildrenTopicsEditor',
  props: ['isVisible', 'parent_id', 'title', 'stars', 'progress'],
  data() {
    return {
      count: 0,
      filter_progress: [0, 100],
      filter_stars: [0, 5],
      filter_content: '影响数据0条',
      progress_marks: {
        0: '0',
        70: '70(写完)'
      },
      dialogVisible: false,
      topicTemp: {
        star: 1,
        ai_paragraph: 1,
        is_crawl_amazon: false,
        serp_crawl: true,
        serp_finished: false,
        tag: '',
        difficulty: 30,
        volume: 0,
        ai_writer: 'autoai',
        progress: 0,
        writer_id: ''
      },
      ai_writers: [
        {
          label: 'openai',
          value: 'openai'
        },
        {
          label: '自动AI',
          value: 'autoai'
        },
        {
          label: '随机组合',
          value: 'random_article'
        },
        {
          label: '混合内容',
          value: 'mix_article'
        },
        {
          label: '不写',
          value: ''
        }

      ]
    }
  },
  watch: {
    isVisible(v) {
      this.dialogVisible = v
      if (!this.parent_id) {
        this.$message.error('parent id没有指定，无法使用')
      }
      this.filter_stars = this.stars
      this.fileter_progress = this.progress
    }
  },
  methods: {
    handleModify(task) {
      const data = {
        min_star: this.filter_stars[0],
        max_star: this.filter_stars[1],
        progress_s: this.filter_progress[0],
        progress_e: this.filter_progress[1],
        parent_id: this.parent_id
      }
      switch (task) {
        // eslint-disable-next-line no-case-declarations
        case 'star':
          data.star = this.topicTemp.star
          break
        case 'tag':
          data.tag = this.topicTemp.tag
          break
        case 'ai':
          data.ai_paragraph = this.topicTemp.ai_paragraph
          data.ai_writer = this.topicTemp.ai_writer
          break
        case 'progress':
          data.progress = this.topicTemp.progress
          break
        case 'serp':
          data.serp_crawl = this.topicTemp.serp_crawl
          break
        case 'delete':
          data.delete = true
          break
        case 'delete_post':
          data.delete_post = true
          break
        case 'count':
          data.get_count = true
      }
      if (data) {
        this.filter_content = '正在查询...'
        topic_childrens_modify(data).then(response => {
          if (response.count !== undefined) {
            this.count = response.count
            this.filter_content = '影响数据:' + this.count + '条'
          }
          if (task !== 'count') this.$message.success('修改成功')
        }).catch(e => {
          this.$message.error('修改失败')
        })
      }
    },
    close() {
      this.$emit('close')
    }
  }
}
</script>

<style scoped>

</style>
